/**
 * Dear programmer:
 * When I wrote this code, only god and I knew how it worked.
 * Now, only god knows it!
 *
 * @author: Pegasus  Date: 2018-12-19 Time: 23:22
 */

import React, {Component} from 'react';
import {
  SafeAreaView,
  Text,
  View,
  TextInput
} from 'react-native';
import {connect} from 'react-redux';
import {doShowDemoValue} from "./Actions"

class DemoScreen extends Component {

  static navigationOptions = {
    title: 'DemoScreen'
  }

  render(): React.ReactNode {
    let {dispatch} = this.props;
    let {onShowDemoValue} = this.props;

    return (
      <SafeAreaView style={{flex: 1}}>

        <View style={{height: 200, justifyContent: 'center', alignItems: 'center'}}>
          <Text style={{fontSize: 16}}>
            {onShowDemoValue}
          </Text>
        </View>

        <View style={{height: 50, marginTop: 50, justifyContent: 'center', alignItems: 'flex-start', borderWidth: 1}}>
          <TextInput
            style={{marginLeft: 20, width: 200}}
            placeholder={'请输入'}
            onChangeText={text => {
              dispatch(doShowDemoValue(text))
            }}
          />
        </View>
      </SafeAreaView>
    )
  }
}

const props = state => {
  return {
    onShowDemoValue: state.onShowDemoValue
  }
}

export default DemoScreen = connect(props)(DemoScreen);